<template>
  <div class="dljjc_box3_x" style="min-height: 100vh">
    <div style="display: flex; gap: 8px; flex-direction: column">
      <div class="nbox2" v-if="val.sdata?.length <= 0">加载数据中</div>
      <div class="nbox2" v-for="item in val.sdata">
        <div class="_name">{{ item.Tag }} ({{ item.System }} - {{ item.Region }})</div>
        <div class="_stat">
          状态：{{ item.Status == "running" ? "运行中" : "已停止" }}
        </div>
        <!--
        <div>成本：￥{{ item.monney }} / 年</div>
        -->
        <div class="_usage">
          CPU：{{ item.cpu_core }}核({{ item?.Usage?.CPU }}%)　 {{ item?.cpu_name }}<br />
          内存：{{
            parseInt((item?.Usage?.MaxMem - item?.Usage?.FreeMem) / 1024 / 1024)
          }}
          / {{ parseInt(item?.Usage?.MaxMem / 1024 / 1024) }}MB<br />

          网络：带宽{{ item?.dx }}（{{ item?.dp }}MB）上传 （{{
            parseInt(item?.Usage?.NetOut / 1024)
          }}KB /s）下载（{{ parseInt(item?.Usage?.NetIn / 1024) }}KB /s）<br />
          硬盘：
          <div v-for="(item2, key2) in item?.Usage?.Disks">
            　{{ key2 }} （{{ (item2.Used / 1024 / 1024 / 1024)?.toFixed(2) }}GB /
            {{ (item2.Total / 1024 / 1024 / 1024)?.toFixed(2) }}GB）
          </div>
        </div>
      </div>
    </div>
  </div>
</template>
<style>
._name {
  font-size: 1.2em;
  text-shadow: 0 0 3px #000;
  margin-bottom: 8px;
}
</style>
<script>
import { cfg } from "@/cfg/cfg.js";

export default defineComponent({
  setup() {
    let val = reactive({
      sdata: [],
    });

    let timeoutId = null;

    let ct = {
      get_list: async () => {
        let res = await cfg.axios.get(`${cfg.url2}`, {
          params: {
            t: "v2/get",
            t2: "api/rin",
          },
        });
        res = res.data;
        if (res.code == 0) {
          const list = res.data;
          val.sdata = list;
          timeoutId = setTimeout(() => {
            ct.get_list();
          }, 3000); // 3秒后继续获取数据
        } else {
          cfg.msg.error(`获取列表失败`);
          return;
        }
      },
    };

    //离开时注销
    onUnmounted(() => {
      if (timeoutId) {
        clearTimeout(timeoutId); // 清除定时器
        timeoutId = null;
      }
    });

    onMounted(async () => {
      await ct.get_list();
    });

    return {
      val,
      ct,
      cfg,
    };
  },

  watch: {},
});
</script>
